<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="../css/2502.css">
    <title>day01.html</title>
</head>

<body>
    <div class="div">
        <div class="horizontal3" style="background: #123;"></div>
        <div class="horizontal3"><a href="https://baike.baidu.com/item/马卡龙" name="imgs"><img src="../img/2502.jpg"
                    class="img" name="imgs"></a></div>
        <div class="horizontal3" style="background: #345;"></div>
    </div>
    <div class="div" style="background: #5e4;"><span id="names"></span></div>
    <div class="div">
        <div class="horizontal4" style="background: #90ff66;">Content-left</div>
        <div class="horizontal4">
            <div class="vertical4" style="background: #666;">row-top</div>
            <div class="vertical4" style="background: #777;">row-center-top</div>
            <div class="vertical4" style="background: #888;">row-center-under</div>
            <div class="vertical4" style="background: #999;">row-under</div>
        </div>
        <div class="horizontal4">
            <div class="vertical3" style="background: #555;">row-top</div>
            <div class="vertical3" style="background: #444;">row-center</div>
            <div class="vertical3" style="background: #333;">row-under</div>
        </div>
        <div class="horizontal4" style="background: #99ffae;">Content-right</div>
    </div>
    <div class="div" style="background: #6fc;">
        <ul>
            <li><a href="#">num</a>
                <ul>
                    <li><a href="#">num1</a></li>
                    <li><a href="#">num2</a></li>
                    <li><a href="#">num3</a></li>
                    <li><a href="#">num4</a></li>
                    <li><a href="#">num5</a></li>
                    <li><a href="#">num6</a></li>
                </ul>
            </li>
            <li><a href="#">float</a></li>
            <li><a href="#">char</a>
                <ul>
                    <li><a href="#">chara</a></li>
                    <li><a href="#">charb</a></li>
                    <li><a href="#">charc</a></li>
                </ul>
            </li>
            <li><a href="#">double</a></li>
            <li><a href="#">string</a>
                <ul>
                    <li><a href="#">str</a></li>
                    <li><a href="#">arr</a></li>
                    <li><a href="#">s</a></li>
                </ul>
            </li>
        </ul>
    </div>
    <script>
        var t = 1
        const foods = ['', '马卡龙', '双色马卡龙', '布丁马卡龙', '多彩马卡龙', '西式甜点', '提拉米苏', '布丁', '芝士蛋糕']
        function fun() {
            var imgs = document.getElementsByName('imgs')
            imgs[0].href = "https://baike.baidu.com/item/" + foods[t]
            imgs[1].src = "../images/con" + String(t) + ".jpg"
            var names = document.getElementById('names').innerText = foods[t]
            t = t % 8 + 1
        }
        window.onload = function () {
            fun()
            setInterval(fun, 2000);
        }
    </script>
</body>

</html>